/* MacStyleDock.js - a function for creating a Mac-OSX-style dock
 *
 * The author of this program, Safalra (Stephen Morley), irrevocably releases
 * all rights to this program, with the intention of it becoming part of the
 * public domain. Because this program is released into the public domain, it
 * comes with no warranty either expressed or implied, to the extent permitted
 * by law.
 *
 * For more public domain JavaScript code by the same author, visit:
 *
 * http://www.safalra.com/web-design/javascript/
*/
 
var MacDock = new Class({
  Implements: [Options, Events],
  
  options: {
    'minimum': 80,
    'maximum': 160,
    'container': $('body'),
    'range': 2,
    'enabled': true
  },
  
  icons: [],
  iconsize: [],
  reflecticons: [],
  count: 0,
  
  initialize: function(options) {
    this.setOptions(options);
    
    var opt = {
      'styles': {
        'text-align': 'center',
        'height': this.options.maximumSize+'px'
      }
    };
    this.container_Icons = new Element("div", opt);
    this.container_RIcons = new Element("div", opt);
    this.options.container.adopt(this.container_Icons);
    this.options.container.adopt(this.container_RIcons);
    
    this.options.container.addEvent("mousemove", this.mouseMove.bind(this));
    this.options.container.addEvent("mouseleave", this.mouseOut.bind(this));
  },
  
  /**
    title: Titel,
    icon:  Pfad zum Bild (Icon),
    reflectIcon: Pfad zum reflektierten Bild,
  */
  add: function(theIcon) {
    var std = {
      'title': "MacOSX-Dock",
      'icon': "img-file.png"
    };
    
    var theIcon = $merge(std, theIcon);
    this.icons[this.count] = new Element("img", {
      'src': theIcon.icon,
      'styles': {
        'position': "relative",
        'margin-top': this.options.maximum
      },
      'events': {
        'click':     this.click.pass(this.count, this)
      }
    });
    //this.reflecticons[this.count] = this.icons[this.count].getReflectImage({'height': 20});
    
    /*this.icons[this.count].morph({
      'margin-top': this.options.maximum - this.options.minimum,
      'width': this.calculateImageWidth(this.options.minimum),
      'height': this.options.minimum
    });*/
    
    this.icons[this.count].addEvent("load", function(dock, iconid){
      //alert(dock.icons[iconid].getSize().x);
      dock.iconsize[iconid] = dock.icons[iconid].getSize();
      dock.icons[iconid].setStyles({
        'height': 0,
        'width': 0,
        'margin-top': dock.options.maximum,
        'margin-left': Math.round(dock.options.minimum/2),
        'margin-right': Math.round(dock.options.minimum/2)
      });
      var sizes = dock.calculateImageSizes(iconid, dock.options.minimum);
      dock.icons[iconid].morph({
        'height': sizes.height,
        'width': sizes.width,
        'margin-top': sizes.marginTop,
        'margin-left': sizes.marginLeft,
        'margin-right': sizes.marginRight
      });
    }.pass([this, this.count]));
    
    this.container_Icons.adopt(this.icons[this.count]);
    this.container_RIcons.adopt(this.reflecticons[this.count]);
    
    this.count++;
    
    return "clicked_"+this.count;
  },
  
  click: function(id) {
    this.fireEvent("clicked_"+(id+1));
  },
    
  calculateImageSizes: function(index, size) {
    var img = this.iconsize[index];
    //alert(img.y + "   " + img.x);
    var r = {
      'height': (img.y >= img.x) ? size : size/img.x*img.y,
      'width': (img.y < img.x) ? size : size/img.y*img.x
    };
    r.marginTop = this.options.maximum - r.height;
    r.marginLeft = r.marginRight = (((r.height>=r.width) ? r.height:r.width)-r.width)/2;
    //alert(r.height);
    return r;
  },
  
  mouseMove: function(e) {
    if(!this.options.enabled) return;
		this.icons.each(function(image, index) {
			var cos = (image.getPosition().x+image.getSize().x/2 - e.client.x)/this.options.maximum;
			cos = Math.max(Math.min(cos,Math.PI/2),-Math.PI/2);
      var size = (Math.max((this.options.maximum*Math.cos(cos)),this.options.minimum)).toInt();
      var sizes = this.calculateImageSizes(index, size);
			image.setStyles({
        'height': sizes.height,
        'width': sizes.width,
        'margin-top': sizes.marginTop,
        'margin-left': sizes.marginLeft,
        'margin-right': sizes.marginRight
      });
			//image.retrieve('caption').setStyle('left',e.client.x-15);
		}, this);
  },
  
  mouseOut: function(e) {
    this.icons.each(function(image, index) {
      var sizes = this.calculateImageSizes(index, this.options.minimum);
      image.set("morph", {'duration': 250}).morph({
        'height': sizes.height,
        'width': sizes.width,
        'margin-top': sizes.marginTop,
        'margin-left': sizes.marginLeft,
        'margin-right': sizes.marginRight
      });
    }, this);
  }
});